<!DOCTYPE html>
<html lang="en-US" dir="ltr">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>javascript | 秋殇の博客</title>
    <meta name="description" content="javascript相关">
    <link rel="preload stylesheet" href="/assets/style.a6a6cd3c.css" as="style">
    <link rel="modulepreload" href="/assets/chunks/VPAlgoliaSearchBox.a18b445d.js">
    <link rel="modulepreload" href="/assets/app.4866b9fc.js">
    <link rel="modulepreload" href="/assets/pages_javascript_code.md.b988f480.lean.js">
    
    <link rel="icon" href="/images/fish.jpg">
  <link rel="manifest" href="/manifest.json">
  <meta name="theme-color" content="#235dc8">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <link rel="apple-touch-icon" href="/images/fish.jpg">
  <link rel="mask-icon" href="/images/fish.jpg" color="#235dc8">
  <meta name="msapplication-TileImage" content="/images/fish.jpg">
  <meta name="msapplication-TileColor" content="#000000">
  <script>var _hmt=_hmt||[];(function(){var e=document.createElement("script");e.src="https://hm.baidu.com/hm.js?f00a6211b690ac3505105511f6b90b30";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})();</script>
  <script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
  </head>
  <body>
    <div id="app"><div class="Layout" data-v-bcf58b99><!--[--><!--]--><!--[--><span tabindex="-1" data-v-c25b702d></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-c25b702d> Skip to content </a><!--]--><!----><header class="VPNav no-sidebar" data-v-bcf58b99 data-v-e7025237><div class="VPNavBar" data-v-e7025237 data-v-4882c5cb><div class="container" data-v-4882c5cb><div class="title" data-v-4882c5cb><div class="VPNavBarTitle" data-v-4882c5cb data-v-c9f092c8><a class="title" href="/" data-v-c9f092c8><!--[--><!--]--><!--[--><img class="VPImage logo" src="/images/fish.jpg" alt data-v-261838bf><!--]--><!--[-->秋殇の博客<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-4882c5cb><div class="curtain" data-v-4882c5cb></div><!--[--><!--]--><div class="VPNavBarSearch search" data-v-4882c5cb style="--d3726eb8:&#39;Meta&#39;;"><div id="docsearch"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-4882c5cb data-v-11c85cf4><span id="main-nav-aria-label" class="visually-hidden" data-v-11c85cf4>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/" data-v-11c85cf4 data-v-bbaa7ea4 data-v-7fdf1e32><!--[-->首页<!--]--><!----></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/pages/list/" data-v-11c85cf4 data-v-bbaa7ea4 data-v-7fdf1e32><!--[-->文章<!--]--><!----></a><!--]--><!--[--><div class="VPFlyout VPNavBarMenuGroup" data-v-11c85cf4 data-v-e54c5eb4><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-e54c5eb4><span class="text" data-v-e54c5eb4><!----> 分类 <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="text-icon" data-v-e54c5eb4><path d="M12,16c-0.3,0-0.5-0.1-0.7-0.3l-6-6c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l5.3,5.3l5.3-5.3c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-6,6C12.5,15.9,12.3,16,12,16z"></path></svg></span></button><div class="menu" data-v-e54c5eb4><div class="VPMenu" data-v-e54c5eb4 data-v-d9758112><div class="items" data-v-d9758112><!--[--><!--[--><div class="VPMenuLink" data-v-d9758112 data-v-80fb0ac9><a class="VPLink link" href="/pages/vue/code.html" data-v-80fb0ac9 data-v-7fdf1e32><!--[-->vue<!--]--><!----></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-d9758112 data-v-80fb0ac9><a class="VPLink link active" href="/pages/javascript/code.html" data-v-80fb0ac9 data-v-7fdf1e32><!--[-->javascript<!--]--><!----></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-d9758112 data-v-80fb0ac9><a class="VPLink link" href="/pages/react/code.html" data-v-80fb0ac9 data-v-7fdf1e32><!--[-->react<!--]--><!----></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-d9758112 data-v-80fb0ac9><a class="VPLink link" href="/pages/react-native/code.html" data-v-80fb0ac9 data-v-7fdf1e32><!--[-->react-native<!--]--><!----></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-d9758112 data-v-80fb0ac9><a class="VPLink link" href="/pages/python/code.html" data-v-80fb0ac9 data-v-7fdf1e32><!--[-->python<!--]--><!----></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/pages/logs/" data-v-11c85cf4 data-v-bbaa7ea4 data-v-7fdf1e32><!--[-->日志<!--]--><!----></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-4882c5cb data-v-8af7bd39><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" aria-label="toggle dark mode" aria-checked="false" data-v-8af7bd39 data-v-cfd5b55f data-v-3532bfcd><span class="check" data-v-3532bfcd><span class="icon" data-v-3532bfcd><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-cfd5b55f><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-cfd5b55f><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-4882c5cb data-v-1043976d data-v-d6312b01><!--[--><a class="VPSocialLink" href="https://github.com/bayi-95/" target="_blank" rel="noopener" data-v-d6312b01 data-v-e02d7003><svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-4882c5cb data-v-441d75c0 data-v-e54c5eb4><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-e54c5eb4><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-e54c5eb4><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-e54c5eb4><div class="VPMenu" data-v-e54c5eb4 data-v-d9758112><!----><!--[--><!--[--><!----><div class="group" data-v-441d75c0><div class="item appearance" data-v-441d75c0><p class="label" data-v-441d75c0>Appearance</p><div class="appearance-action" data-v-441d75c0><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" aria-label="toggle dark mode" aria-checked="false" data-v-441d75c0 data-v-cfd5b55f data-v-3532bfcd><span class="check" data-v-3532bfcd><span class="icon" data-v-3532bfcd><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-cfd5b55f><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-cfd5b55f><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><div class="group" data-v-441d75c0><div class="item social-links" data-v-441d75c0><div class="VPSocialLinks social-links-list" data-v-441d75c0 data-v-d6312b01><!--[--><a class="VPSocialLink" href="https://github.com/bayi-95/" target="_blank" rel="noopener" data-v-d6312b01 data-v-e02d7003><svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-4882c5cb data-v-33db8862><span class="container" data-v-33db8862><span class="top" data-v-33db8862></span><span class="middle" data-v-33db8862></span><span class="bottom" data-v-33db8862></span></span></button></div></div></div><!----></header><!----><!----><div class="VPContent" id="VPContent" data-v-bcf58b99 data-v-d068f002><div class="VPDoc has-aside" data-v-d068f002 data-v-2715c46c><div class="container" data-v-2715c46c><div class="aside" data-v-2715c46c><div class="aside-curtain" data-v-2715c46c></div><div class="aside-container" data-v-2715c46c><div class="aside-content" data-v-2715c46c><div class="VPDocAside" data-v-2715c46c data-v-62f1dbe3><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" data-v-62f1dbe3 data-v-7a7145f2><div class="content" data-v-7a7145f2><div class="outline-marker" data-v-7a7145f2></div><div class="outline-title" data-v-7a7145f2>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-7a7145f2><span class="visually-hidden" id="doc-outline-aria-label" data-v-7a7145f2> Table of Contents for current page </span><ul class="root" data-v-7a7145f2 data-v-f3203836><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-62f1dbe3></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-2715c46c><div class="content-container" data-v-2715c46c><!--[--><!--]--><main class="main" data-v-2715c46c><div style="position:relative;" class="vp-doc _pages_javascript_code" data-v-2715c46c><div><h2 id="关于-vue-下组件引入第三方外部外链-js-几种方式" tabindex="-1">关于 Vue 下组件引入第三方外部外链 Js 几种方式 <a class="header-anchor" href="#关于-vue-下组件引入第三方外部外链-js-几种方式" aria-hidden="true">#</a></h2><p><a href="https://blog.csdn.net/u010881899/article/details/80895661" target="_blank" rel="noreferrer">https://blog.csdn.net/u010881899/article/details/80895661</a></p><h2 id="nginx-一键配置" tabindex="-1">nginx 一键配置 <a class="header-anchor" href="#nginx-一键配置" aria-hidden="true">#</a></h2><p><a href="https://nginxconfig.io/" target="_blank" rel="noreferrer">https://nginxconfig.io/</a></p><h2 id="lodash-按需加载" tabindex="-1">lodash 按需加载 <a class="header-anchor" href="#lodash-按需加载" aria-hidden="true">#</a></h2><p><a href="https://www.jianshu.com/p/f03ff4f3a8b3" target="_blank" rel="noreferrer">https://www.jianshu.com/p/f03ff4f3a8b3</a></p><h2 id="threejs" tabindex="-1">threeJs <a class="header-anchor" href="#threejs" aria-hidden="true">#</a></h2><h4 id="中文教程" tabindex="-1">中文教程 <a class="header-anchor" href="#中文教程" aria-hidden="true">#</a></h4><div class="warning custom-block"><p class="custom-block-title">WARNING</p><p>This is a warning</p></div><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-palenight"><code><span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;">/**</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;"> * Promise 实现 遵循promise/A+规范</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;"> * Promise/A+规范译文:</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;"> * https://malcolmyu.github.io/2015/06/12/Promises-A-Plus/#note-4</span></span>
<span class="line"><span style="color:#676E95;font-style:italic;"> */</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// promise 三个状态</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> PENDING </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">pending</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> FULFILLED </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">fulfilled</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#A6ACCD;"> REJECTED </span><span style="color:#89DDFF;">=</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">rejected</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#C792EA;">function</span><span style="color:#A6ACCD;"> </span><span style="color:#82AAFF;">Promise</span><span style="color:#89DDFF;">(</span><span style="color:#A6ACCD;font-style:italic;">excutor</span><span style="color:#89DDFF;">)</span><span style="color:#A6ACCD;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;">    </span><span style="color:#C792EA;">let</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">that</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">this;</span><span style="color:#F07178;"> </span><span style="color:#676E95;font-style:italic;">// 缓存当前promise实例对象</span></span>
<span class="line"><span style="color:#F07178;">    </span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">status</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">PENDING</span><span style="color:#89DDFF;">;</span><span style="color:#F07178;"> </span><span style="color:#676E95;font-style:italic;">// 初始状态</span></span>
<span class="line"><span style="color:#F07178;">    </span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">value</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">undefined;</span><span style="color:#F07178;"> </span><span style="color:#676E95;font-style:italic;">// fulfilled状态时 返回的信息</span></span>
<span class="line"><span style="color:#F07178;">    </span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">reason</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">undefined;</span><span style="color:#F07178;"> </span><span style="color:#676E95;font-style:italic;">// rejected状态时 拒绝的原因</span></span>
<span class="line"><span style="color:#F07178;">    </span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">onFulfilledCallbacks</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> []</span><span style="color:#89DDFF;">;</span><span style="color:#F07178;"> </span><span style="color:#676E95;font-style:italic;">// 存储fulfilled状态对应的onFulfilled函数</span></span>
<span class="line"><span style="color:#F07178;">    </span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">onRejectedCallbacks</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> []</span><span style="color:#89DDFF;">;</span><span style="color:#F07178;"> </span><span style="color:#676E95;font-style:italic;">// 存储rejected状态对应的onRejected函数</span></span>
<span class="line"></span>
<span class="line"><span style="color:#F07178;">    </span><span style="color:#C792EA;">function</span><span style="color:#F07178;"> </span><span style="color:#82AAFF;">resolve</span><span style="color:#89DDFF;">(</span><span style="color:#A6ACCD;font-style:italic;">value</span><span style="color:#89DDFF;">)</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> </span><span style="color:#676E95;font-style:italic;">// value成功态时接收的终值</span></span>
<span class="line"><span style="color:#F07178;">        </span><span style="color:#89DDFF;font-style:italic;">if</span><span style="color:#F07178;">(</span><span style="color:#A6ACCD;">value</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">instanceof</span><span style="color:#F07178;"> </span><span style="color:#FFCB6B;">Promise</span><span style="color:#F07178;">) </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;">            </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">value</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">then</span><span style="color:#F07178;">(</span><span style="color:#A6ACCD;">resolve</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">reject</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;">        </span><span style="color:#89DDFF;">}</span></span>
<span class="line"></span>
<span class="line"><span style="color:#89DDFF;">        </span><span style="color:#676E95;font-style:italic;">// 为什么resolve 加setTimeout?</span></span>
<span class="line"><span style="color:#89DDFF;">        </span><span style="color:#676E95;font-style:italic;">// 2.2.4规范 onFulfilled 和 onRejected 只允许在 execution context 栈仅包含平台代码时运行.</span></span>
<span class="line"></span>
<span class="line"><span style="color:#F07178;">        </span><span style="color:#82AAFF;">setTimeout</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">()</span><span style="color:#F07178;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#89DDFF;">            </span><span style="color:#676E95;font-style:italic;">// 调用resolve 回调对应onFulfilled函数</span></span>
<span class="line"><span style="color:#F07178;">            </span><span style="color:#89DDFF;font-style:italic;">if</span><span style="color:#F07178;"> (</span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">status</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">===</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">PENDING</span><span style="color:#F07178;">) </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#89DDFF;">                </span><span style="color:#676E95;font-style:italic;">// 只能由pending状态 =&gt; fulfilled状态 (避免调用多次resolve reject)</span></span>
<span class="line"><span style="color:#F07178;">                </span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">status</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">FULFILLED</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;">                </span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">value</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">value</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;">                </span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">onFulfilledCallbacks</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">forEach</span><span style="color:#F07178;">(</span><span style="color:#A6ACCD;font-style:italic;">cb</span><span style="color:#F07178;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#F07178;"> </span><span style="color:#82AAFF;">cb</span><span style="color:#F07178;">(</span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">value</span><span style="color:#F07178;">))</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;">            </span><span style="color:#89DDFF;">}</span></span>
<span class="line"><span style="color:#F07178;">        </span><span style="color:#89DDFF;">}</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;">    </span><span style="color:#89DDFF;">}</span></span>
<span class="line"></span>
<span class="line"><span style="color:#F07178;">    </span><span style="color:#C792EA;">function</span><span style="color:#F07178;"> </span><span style="color:#82AAFF;">reject</span><span style="color:#89DDFF;">(</span><span style="color:#A6ACCD;font-style:italic;">reason</span><span style="color:#89DDFF;">)</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> </span><span style="color:#676E95;font-style:italic;">// reason失败态时接收的拒因</span></span>
<span class="line"><span style="color:#F07178;">        </span><span style="color:#82AAFF;">setTimeout</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">()</span><span style="color:#F07178;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#89DDFF;">            </span><span style="color:#676E95;font-style:italic;">// 调用reject 回调对应onRejected函数</span></span>
<span class="line"><span style="color:#F07178;">            </span><span style="color:#89DDFF;font-style:italic;">if</span><span style="color:#F07178;"> (</span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">status</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">===</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">PENDING</span><span style="color:#F07178;">) </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#89DDFF;">                </span><span style="color:#676E95;font-style:italic;">// 只能由pending状态 =&gt; rejected状态 (避免调用多次resolve reject)</span></span>
<span class="line"><span style="color:#F07178;">                </span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">status</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">REJECTED</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;">                </span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">reason</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">reason</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;">                </span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">onRejectedCallbacks</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">forEach</span><span style="color:#F07178;">(</span><span style="color:#A6ACCD;font-style:italic;">cb</span><span style="color:#F07178;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#F07178;"> </span><span style="color:#82AAFF;">cb</span><span style="color:#F07178;">(</span><span style="color:#A6ACCD;">that</span><span style="color:#89DDFF;">.</span><span style="color:#A6ACCD;">reason</span><span style="color:#F07178;">))</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;">            </span><span style="color:#89DDFF;">}</span></span>
<span class="line"><span style="color:#F07178;">        </span><span style="color:#89DDFF;">}</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;">    </span><span style="color:#89DDFF;">}</span></span>
<span class="line"></span>
<span class="line"><span style="color:#89DDFF;">    </span><span style="color:#676E95;font-style:italic;">// 捕获在excutor执行器中抛出的异常</span></span>
<span class="line"><span style="color:#89DDFF;">    </span><span style="color:#676E95;font-style:italic;">// new Promise((resolve, reject) =&gt; {</span></span>
<span class="line"><span style="color:#89DDFF;">    </span><span style="color:#676E95;font-style:italic;">//     throw new Error(&#39;error in excutor&#39;)</span></span>
<span class="line"><span style="color:#89DDFF;">    </span><span style="color:#676E95;font-style:italic;">// })</span></span>
<span class="line"><span style="color:#F07178;">    </span><span style="color:#89DDFF;font-style:italic;">try</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;">        </span><span style="color:#82AAFF;">excutor</span><span style="color:#F07178;">(</span><span style="color:#A6ACCD;">resolve</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#A6ACCD;">reject</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;">    </span><span style="color:#89DDFF;">}</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">catch</span><span style="color:#F07178;"> (</span><span style="color:#A6ACCD;">e</span><span style="color:#F07178;">) </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;">        </span><span style="color:#82AAFF;">reject</span><span style="color:#F07178;">(</span><span style="color:#A6ACCD;">e</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;">    </span><span style="color:#89DDFF;">}</span></span>
<span class="line"><span style="color:#89DDFF;">}</span></span>
<span class="line"></span>
<span class="line"></span></code></pre></div></div></div></main><!--[--><!--]--><footer class="VPDocFooter" data-v-2715c46c data-v-b6f746ca><div class="edit-info" data-v-b6f746ca><div class="edit-link" data-v-b6f746ca><a class="VPLink link edit-link-button" href="https://github.com/bayi-95/my-bolg/tree/master/docs/pages/javascript/code.md" target="_blank" rel="noreferrer" data-v-b6f746ca data-v-7fdf1e32><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" class="edit-link-icon" data-v-b6f746ca><path d="M18,23H4c-1.7,0-3-1.3-3-3V6c0-1.7,1.3-3,3-3h7c0.6,0,1,0.4,1,1s-0.4,1-1,1H4C3.4,5,3,5.4,3,6v14c0,0.6,0.4,1,1,1h14c0.6,0,1-0.4,1-1v-7c0-0.6,0.4-1,1-1s1,0.4,1,1v7C21,21.7,19.7,23,18,23z"></path><path d="M8,17c-0.3,0-0.5-0.1-0.7-0.3C7,16.5,6.9,16.1,7,15.8l1-4c0-0.2,0.1-0.3,0.3-0.5l9.5-9.5c1.2-1.2,3.2-1.2,4.4,0c1.2,1.2,1.2,3.2,0,4.4l-9.5,9.5c-0.1,0.1-0.3,0.2-0.5,0.3l-4,1C8.2,17,8.1,17,8,17zM9.9,12.5l-0.5,2.1l2.1-0.5l9.3-9.3c0.4-0.4,0.4-1.1,0-1.6c-0.4-0.4-1.2-0.4-1.6,0l0,0L9.9,12.5z M18.5,2.5L18.5,2.5L18.5,2.5z"></path></svg> Edit this page<!--]--><!----></a></div><div class="last-updated" data-v-b6f746ca><p class="VPLastUpdated" data-v-b6f746ca data-v-4a6113bb>Last updated: <time datetime="2023-03-29T09:22:44.000Z" data-v-4a6113bb></time></p></div></div><!----></footer><!--[--><!--]--></div></div></div></div></div><footer class="VPFooter" data-v-bcf58b99 data-v-648d7a08><div class="container" data-v-648d7a08><p class="message" data-v-648d7a08>部分文章收录于网络，转载请署名出处 | 联系博主可以发送邮件至 <a href="mailto:necro.vice@yahoo.com">necro.vice@yahoo.com</a></p><p class="copyright" data-v-648d7a08>Copyright © 2020-present</p></div></footer><!--[--><!--]--></div></div>
    <script>__VP_HASH_MAP__ = JSON.parse("{\"pages_javascript_source.md\":\"d80352b7\",\"pages_list_index.md\":\"c8c09e37\",\"pages_javascript_code.md\":\"b988f480\",\"index.md\":\"1ec62178\",\"pages_javascript_暗黑模式前端修改方案.md\":\"6cdec8ec\",\"pages_python_code.md\":\"ed62e3b2\",\"pages_python_source.md\":\"4b129630\",\"pages_react-native_code.md\":\"02e43813\",\"pages_react-native_index.md\":\"1ef81306\",\"pages_react-native_source.md\":\"d9eab48b\",\"pages_react_code.md\":\"94a0feee\",\"pages_react_source.md\":\"56f349ec\",\"pages_vue_code.md\":\"73247b19\",\"pages_logs_index.md\":\"35beb15f\",\"pages_vue_source.md\":\"1b064215\",\"pages_idea_思维模型.md\":\"50ebcb7f\",\"pages_idea_爱和治愈自己.md\":\"fad6366d\"}")</script>
    <script type="module" async src="/assets/app.4866b9fc.js"></script>
    
  </body>
</html>